<script setup lang="ts">
const props: any = defineProps<{
    ujt: any;
}>();
const { $db, $global, $fn } = props.ujt;

const { editUser, initUser, cmLvList } = $fn.useUser(props);
initUser();
</script>

<template>
    <div class="as-user-area-manage">
        <div class="as-user">
            <slot name="tit"></slot>
            <label>
                <div>{{ $fn.lg('channeluser.data.us') }}：</div>
                {{ $db.channeluser.cur.us }}
            </label>
            <template
                v-if="
                    $db.channeluser.cur.lv < $global.user?.info?.lv ||
                    $db.channeluser.cur.us === $global.user?.info?.us
                "
            >
                <label>
                    <div>{{ $fn.lg('channeluser.data.pw') }}：</div>
                    <input type="password" v-model="$db.channeluser.cur.pw" />
                </label>
                <label v-if="$db.channeluser.cur.us !== $global.user?.info?.us">
                    <div>{{ $fn.lg('channeluser.data.lv') }}：</div>
                    <select v-model="$db.channeluser.cur.lv">
                        <option
                            v-for="item of cmLvList"
                            :key="'lv' + item[0]"
                            :value="+item[0]"
                        >
                            {{ item[1] }}
                        </option>
                    </select>
                </label>
                <div class="as-user-btns">
                    <div class="cur" @pointerdown="editUser()">
                        {{ $fn.lg('channeluser.ui.edit') }}
                    </div>
                    <slot name="btn"></slot>
                </div>
            </template>
            <template v-else>
                <div class="as-user-dec">
                    {{ $fn.lg('channeluser.ui.nopower') }}
                </div>
                <div class="as-user-btns">
                    <slot name="btn"></slot>
                </div>
            </template>
        </div>
    </div>
</template>

<style scoped lang="scss"></style>
